Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix optional property types #6872

Open
wants to merge 304 commits into
base: main
Choose a base branch
from

Conversation

alecmev
Copy link

@alecmev alecmev commented Aug 13, 2024

Addresses #1890 (comment)

✅ Pull Request Checklist:

  • Included link to corresponding React Spectrum GitHub Issue.
  • Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • Filled out test instructions.
  • Updated documentation (if it already exists for this component).
  • Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

Install any of react-spectrum packages that bring in @internationalized/date and @react-types/shared, and type-check the project with exactOptionalPropertyTypes: true.

hourCycle causes this:

│ node_modules/@internationalized/date/dist/types.d.ts:615:11 - error TS2430: Interface 'import(".../node_modules/@internationalized/date/dist/types").ResolvedDateTimeFormatOptions' incorrectly extends interface 'Intl.ResolvedDateTimeFormatOptions'.
│   Types of property 'hourCycle' are incompatible.
│     Type '"h11" | "h12" | "h23" | "h24" | undefined' is not assignable to type '"h11" | "h12" | "h23" | "h24"'.
│       Type 'undefined' is not assignable to type '"h11" | "h12" | "h23" | "h24"'.
│ 
│ 615 interface ResolvedDateTimeFormatOptions extends Intl.ResolvedDateTimeFormatOptions {
│               ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


│ node_modules/@internationalized/date/dist/types.d.ts:633:5 - error TS2416: Property 'resolvedOptions' in type 'DateFormatter' is not assignable to the same property in base type 'DateTimeFormat'.
│   Type '() => import(".../node_modules/@internationalized/date/dist/types").ResolvedDateTimeFormatOptions' is not assignable to type '() => Intl.ResolvedDateTimeFormatOptions'.
│     Type 'import(".../node_modules/@internationalized/date/dist/types").ResolvedDateTimeFormatOptions' is not assignable to type 'Intl.ResolvedDateTimeFormatOptions' with 'exactOptionalPropertyTypes: true'. Consider adding 'undefined' to the types of the target's properties.
│ 
│ 633     resolvedOptions(): ResolvedDateTimeFormatOptions;
│         ~~~~~~~~~~~~~~~

DOMProps causes this:

│ node_modules/react-aria-components/dist/types.d.ts:1148:18 - error TS2430: Interface 'GroupProps' incorrectly extends interface 'DOMProps'.
│   Types of property 'id' are incompatible.
│     Type 'string | undefined' is not assignable to type 'string'.
│       Type 'undefined' is not assignable to type 'string'.
│ 
│ 1148 export interface GroupProps extends AriaLabelingProps, Omit<HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style' | 'role' | 'slot'>, _DOMProps1, HoverProps, RenderProps<GroupRenderProps>, SlotProps {
│                       ~~~~~~~~~~

LFDanLu and others added 30 commits February 23, 2024 13:34
* initial add progress bar

* add animationIterationCount to theme

* add story decorators for static color backgrounds

* more style fixes

* more value fixes

* support classnames in field label

* cleanup

* cleanup

* address review comments

* add autodocs

* update size jsdoc

* fix label position and row gap

* use self(height) instead of new variable

* improve styles

* remove width prop

* move text static colors to FieldLabel

* use full border radius

* various color improvements

Co-authored-by: Reid Barber <[email protected]>
* Add pre commit hook for lint
* add new story with Tag links

* style cursor as pointer for links

* add Link to empty tag example

* remove errorMessage prop

* fix isEmphasized text color

* remove isRequired prop

* update field gap to match other fields

* make renderEmptyState font family sans

* remove dup key in theme

* fix WebkitTapHighlightColor for disabled tag

* remove WebkitTapHighlightColor handling

* cleanup stories

Co-authored-by: Reid Barber <[email protected]>
* renaming to picker and adding initial style macro changes

* field and input styles added

* two quick style fixes from feedback

* removing staticColor, fixing isDisabled, and improving some prop handling

* lint spacing fixes

* fixing the focusRing after menu close

* quiet style as element with rounded ends

* undid testing mode

* implementing the isQuiet focus ring more closely, but looks less correct

* chevron icon cleanup

* refining styles based on feedback

Co-authored-by: Kyle Taborski <[email protected]>
* initialize ref support

* add more ref support to components

* clean up

* more cleanup

* update refs

* remove dialog inner export, make helptext ref optional, fix ts

* more ts fixes

Co-authored-by: Yihui Liao <[email protected]>
* Fix disabled, emphasized, selected ToggleButton style

* Make it so selected quiet disabled toggle buttons are consistent with the non quiet variant

at the moment the designs show that disabled toggle buttons shouldnt have any style differences whether they are selected or not

* make forced colors match when selected/not selected and disabled
* Remove styleProps in InlineAlert

* create new styleProps with UNSAFE

* new file for styleProps

Co-authored-by: Yihui Liao <[email protected]>
Workflow icons
* Popover and Menu
* add isEmphasized to CheckboxGroup

* omits isDisabled from DropZone

* prioritize checkbox group isEmphasized

Co-authored-by: Yihui Liao <[email protected]>
* update illustrated message font size

* remove v3 style props

* remove unneccessary styling

Co-authored-by: Yihui Liao <[email protected]>
* ActionMenu and positioning props for Menu
yihuiliao and others added 6 commits August 22, 2024 12:20
* feat: add rounded edges and side label to progress bar

* only add margin if label exists
* feat: add subtle and outline fill to s2 badge

* update comment

* add transparent border, fix neutral outline color

* fix layout

* make props optional
* Fix lint job on CI
* remove --extensions as they are unnecessary

add is-mingw
use isMinGW to use proper slashes on windows git bash

* remove logs from preview builder

* is-mingw is a dev dep

* patching storybook-builder-parcel to solve windows forward slash issues

---------

Co-authored-by: David Coleman <[email protected]>
Co-authored-by: Daniel Lu <[email protected]>
* Fix Safari docs crash
@alecmev alecmev force-pushed the fix-optional-property-types branch from c04c9f6 to 30e77c7 Compare August 24, 2024 14:05
packages/@internationalized/date/src/DateFormatter.ts Outdated Show resolved Hide resolved
@@ -59,7 +59,7 @@ export interface DOMProps {
/**
* The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id).
*/
id?: string
id?: string | undefined
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this looks correct, but is really going to need to exist in so many more places
https://github.com/microsoft/TypeScript/blob/a86b5e2b01075db5046521958a3e0b905b4ca667/tests/lib/react18/react18.d.ts#L1863

Any way we can use the type from the original set instead of creating our own? maybe extends Pick<HTMLElement, 'id'>?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The focus of this PR is to just fix the public API. I don't see anything wrong with adding | undefined in more places, but that's #1890.

Updated to use extends 😉

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sure, I guess i'm worried about potential regressions, and I'm also not sure that this is really all there is to fix in the public API, seems like too small a change?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You're right, there's most likely more, I only submitted the changes necessary to unblock our particular cocktail of Spectrum 😛 I'll create more PRs in the future as I run into other issues.

Hopefully #1890 will be addressed soon, but until then, one option could be to add a quick smoke test, that just lists every single package as a dependency and runs tsc with skipLibCheck: false, strict: true and exactOptionalPropertyTypes: true? This will allow you to make sure that the public API is clean, without switching the whole monorepo to exactOptionalPropertyTypes: true.

@alecmev alecmev force-pushed the fix-optional-property-types branch from 5d21ca7 to 0ad564b Compare August 29, 2024 12:43
snowystinger
snowystinger previously approved these changes Aug 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.